<template>
  <div class="index">
    <Header></Header>
    <div class="content">
      <router-view></router-view>
    </div>
    <div class="footer" style="text-align: center">
      Copy @2020 V0.0.1
    </div>
  </div>
</template>

<script>
  import Header from './Header'

  export default {
    name: 'Index',
    components: {Header}
  }
</script>

<style scoped>
  .index {
    width: 100%;
    height: 100%;
  }

  .content {
    width: 100%;
    height: calc(100% - 72px);
    border-bottom: #cccccc 1px solid;
  }


  .footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 20px;
    background-color: #ffffff;
    color: #333333;
  }


</style>
